<template>
  <div>
    <button @click="componentName = 'First'">First</button>
    <button @click="componentName = 'Second'">Second</button>
    <button @click="componentName = 'Third'">third</button>

    <keep-alive exclude="Third,First">
      <component :is="componentName"></component>
    </keep-alive>
  </div>
</template>

<script>
import First from "@/components/First.vue";
import Second from "@/components/Second.vue";
import Third from "@/components/Third.vue";
export default {
  components: {
    First,
    Second,
    Third,
  },
  data() {
    return {
      componentName: "First",
    };
  },
};
</script>

<style>
</style>